//输入框的hover和焦点处理事件
var $qs=$('.register .form .q');
var $qs_inputs=$('.register .form .q input');
var $tips=$('.register .form .tip');
let isKeyuped={email:0,check:0,checkcode:0,user:0,pwd:0,pwd2:0};
let haveErr={email:0,check:0,checkcode:0,user:0,pwd:0,pwd2:0};
let tipsFor={email:$tips[0],check:$tips[1],checkcode:$tips[2],user:$tips[3],pwd:$tips[4],pwd2:$tips[5]};
let mouseEvent=1;
const emailMsg={normarl:'验证完成后，你可以通过该邮箱登录或者找回密码',err:'邮箱格式错误',ok:''};
const checkcodeMsg={normarl:'60s内有效哦',err:['验证码错误','验证码已过期,请重新验证','请输入验证码'],ok:'验证成功,离会员就差下一步了'};
const userMsg={normarl:'不能含有中文字符哦',err:['账号包含中文字符','账号已被注册'],ok:''};
const pwdMsg={normarl:'至少要8位哦',err:'密码应该不少于8位',ok:''};
const pwd2Msg={normarl:'再次确认密码哦',err:'密码不一致',ok:''};
var $next=$('.register .form .next');
var $forms=$('.register .form form>div');
var $stepIndex=$('.progress-bar .step-index');
var $stepDesc=$('.progress-bar .step-desc');
var $proLine=$('.progress-bar .pro-line');
let inputNum=[2,5,0];
let tipMsg=['请输入邮箱','请先验证','请输入验证码','请输入账号','请输入密码','请再次确认密码','请完成验证'];
var $checkbtn=$('.register .check-email .checkbtn');
var $checkcode=$('.check-code');
var $showTime=$('.check-code .time');
var $btn=$('.check-code .btn');
let currIndex=0;
let second=60;
let timer= 0;
let checkisShow=0;
let checkisOK=0;
let userisOK=0;
let checkCode='';
let tipgxb=['email','check','checkcode','user','pwd','pwd2'];
$qs.mouseover((event)=>{
    event = event ||window.event;
    let label =event.currentTarget.children[0];
    let input =event.currentTarget.children[1];
    if(mouseEvent){
        label.style.borderColor="#666";
        input.style.borderColor="#666"
    }
})
$qs.mouseleave((event)=>{
    event = event ||window.event;
    let label =event.currentTarget.children[0];
    let input =event.currentTarget.children[1];
    if(mouseEvent){
        label.style.borderColor="#d3d3d3";
        input.style.borderColor="#d3d3d3"
    }

})
/* 工具人*/
function sendNorTips(id){
    let tip=tipsFor[id];
    switch (id) {
        case 'email':
            tip.innerHTML=`<i class='normal-tip'></i><p class='normal-tip'>${emailMsg.normarl}</p>`;
            break;
        case 'user':
            tip.innerHTML=`<i class='normal-tip'></i><p class='normal-tip'>${userMsg.normarl}</p>`;
            break;
        case 'pwd':
            tip.innerHTML=`<i class='normal-tip'></i><p class='normal-tip'>${pwdMsg.normarl}</p>`;
            break;
        case 'pwd2':
            tip.innerHTML=`<i class='normal-tip'></i><p class='normal-tip'>${pwd2Msg.normarl}</p>`;
            break;
        case 'checkcode':
            tip.innerHTML=`<i class='normal-tip'></i><p class='normal-tip'>${checkcodeMsg.normarl}</p>`;
            break;
    }
}
function sendErrTips(id,isKeyuped,value,i=0){
    let tip=tipsFor[id];
    tip.innerHTML="";
    if(!isKeyuped[id] && id!=='checkcode'){
        return
    }
    switch (id) {
        case 'email':
            if(!/\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/.test(value)){
                haveErr.email=1;
                tip.innerHTML=`<i></i><p>${emailMsg.err}</p>`
            }
            break;
        case 'user':
            if(/[\u4e00-\u9fa5]/gm.test(value)){
                haveErr.user=1;
                tip.innerHTML=`<i></i><p>${userMsg.err[i]}</p>`
            }
            break;
        case 'pwd':
            if(value.length<8){
                haveErr.pwd=1;
                tip.innerHTML=`<i></i><p>${pwdMsg.err}</p>`
            }
            break;
        case 'pwd2':
            let pwd=$('.pwd .input input').val();
            if(value !==pwd){
                haveErr.pwd2=1;
                tip.innerHTML=`<i></i><p>${pwd2Msg.err}</p>`
            }
            break;
        case 'checkcode':
            if(value ===checkCode && second!==60){
                checkisOK=1;
                tip.innerHTML=`<i class="ok-tip"></i><p class="ok-tip">${checkcodeMsg.ok}</p>`

            }else{
                haveErr.checkcode=1;
                tip.innerHTML=`<i></i><p>${checkcodeMsg.err[i]}</p>`
            }
            break;
    }
}
/* ################# */

$qs_inputs.focus((event)=>{
    mouseEvent=0;
    event = event ||window.event;
    let div=event.target.parentNode;
    let span=event.target.parentNode.previousSibling;
    div.style.borderColor="#666";
    span.style.borderColor="#d3d3d3";
    let id=$(div.parentNode).attr("id");
    haveErr[id]=0;
    if(id==="checkcode"){
        haveErr['check']=0;
        tipsFor['check'].innerHTML='';
    }
    sendNorTips(id)
});

$qs_inputs.keyup((event)=>{
    event=event||window.event;
    let that=event.target;
    let div=that.parentNode;
    let id=$(div.parentNode).attr("id");
    if(event.keyCode===8 || (event.keyCode>=48 && event.keyCode<=111 && event.keyCode!==91 )){
        if(id!=='checkcode'){
            haveErr[id]=0
        }
    }
    if(that.value.length===0 && (event.keyCode === 8 || event.keyCode === 9)){
        isKeyuped[id]=0
    }else{
        isKeyuped[id]=1
    }
    sendNorTips(id);


});

$qs_inputs.blur(async (event)=>{
    mouseEvent=1;
    event = event ||window.event;
    let that=event.target;
    let div=that.parentNode;
    div.style.borderColor="#d3d3d3";
    let id=$(div.parentNode).attr("id");
    if(id==='checkcode'){
        tipsFor[id].innerHTML='';
        return
    }
    else if(id==='email'){
        tipsFor['check'].innerHTML='';
    }
    sendErrTips(id,isKeyuped,that.value)
});
//进度的实现

$btn.click((e)=>{
    e=e||window.e;
    let id=$(e.target.previousElementSibling).attr("id");
    let value=$qs_inputs[1].value;
    if(value===''){
        haveErr.checkcode=1;
        tipsFor.checkcode.innerHTML=`<i></i><p>${checkcodeMsg.err[2]}</p>`
        return
    }
    if(second!==60){
        sendErrTips(id,isKeyuped,value)
    }else{
        sendErrTips(id,isKeyuped,value,1)
    }

});
$checkbtn.click(async (e)=>{
    let email=$qs_inputs[0].value;
    if(email===''){
        if(currIndex===0){
            haveErr.email=1;
            $tips[0].innerHTML=`<i></i><p>${tipMsg[0]}</p>`
        }
    }

    if(!haveErr.email && !timer){
        checkCode=await new Promise((resolve)=>{
            $.ajax({
                type:'POST',
                data:{check:{type:'email',data:email,sendOnly:false}},
                url:'http://127.0.0.1:8080/check',
                success:(data)=>{
                    resolve(data.result)
                }
            });
        });
        if(checkCode==0){
            $tips[0].innerHTML=`<i></i><p>邮箱已被绑定</p>`;
            return
        }
        $checkcode.fadeIn(1000);
        $checkbtn.text('点击按钮重新验证');
        checkisShow=1;
        haveErr['check']=0;
        tipsFor['check'].innerHTML='';
        timer=setInterval(()=>{
            second--;
            $showTime.text(`(${second}s)`);
            if(second<0){
                clearInterval(timer);
                timer=0;
                second=60;
                $showTime.text('')
            }
        },1000)

    }
});
let isReg=0;
$next.click(async ()=>{

    for(let i=currIndex;i<inputNum[currIndex];i++){
        if($qs_inputs[i].value.length===0){
            if(currIndex===0){
                if(i>0 && haveErr[tipgxb[i-1]]){
                    haveErr['check']=0;
                    tipsFor['check'].innerHTML='';
                    return
                }else if(checkisShow){
                    haveErr['checkcode']=1;
                    tipsFor['checkcode'].innerHTML=`<i></i><p>${tipMsg[6]}</p>`;
                    return
                }
                haveErr[tipgxb[i]]=1;
                $tips[i].innerHTML=`<i></i><p>${tipMsg[i]}</p>`
            }else if(currIndex===1){
                if(i>2 && haveErr[tipgxb[i]]){
                    return
                }
                haveErr[tipgxb[i+1]]=1;
                $tips[i+1].innerHTML=`<i></i><p>${tipMsg[i+1]}</p>`
            }
            return
        }else{
            if(currIndex===0 && checkisShow && !checkisOK){
                haveErr['checkcode']=1;
                tipsFor['checkcode'].innerHTML=`<i></i><p>${tipMsg[6]}</p>`;
                return
            }

        }
    }

    if(currIndex===1 && $qs_inputs[2].value.length && $qs_inputs[3].value.length && $qs_inputs[4].value.length){
        let user=$qs_inputs[2].value;
        userisOK=await new Promise((resolve,reject)=>{
            $.ajax({
                type:'POST',
                data:{check:{type:'user',data:user}},
                url:'http://127.0.0.1:8080/check',
                success:(data)=>{
                    resolve(data.result)
                }
            });
        });
        if(!haveErr.user && !haveErr.pwd && !haveErr.pwd2 && !userisOK){
            haveErr['user']=1;
            tipsFor['user'].innerHTML=`<i></i><p>${userMsg.err[1]}</p>`;
        }

    }
    if(haveErr.email || haveErr.check || haveErr.checkcode || !checkisOK || haveErr.user || haveErr.pwd || haveErr.pwd2){
        return
    }
    if(userisOK){
        let user=$qs_inputs[2].value;
        let pwd=$qs_inputs[3].value;
        let email=$qs_inputs[0].value;
        isReg=await new Promise((resolve,reject)=>{
            $.ajax({
                type:'POST',
                data:{user,pwd,email},
                url:'http://127.0.0.1:8080/register',
                success:(data)=>{
                    resolve(data);
                }
            });
        });
        if( currIndex==1 && isReg!=1 ){
            $tips[6].innerHTML=`<i></i><p>网络不稳定,请稍后再试</p>`;
            return
        }
        let $loginBtn=$('#loginBtn a');
        $loginBtn.prop('href',`/login?user=${user}`);
    }

    let nextIndex=currIndex+1;
    if(nextIndex>2){
        nextIndex=2
    }
    $($forms[currIndex]).addClass("hidden");
    $($stepIndex[nextIndex]).addClass("curr-step");
    $($stepDesc[nextIndex]).addClass("curr-step");
    $($proLine[nextIndex-1]).addClass("pro-curr");
    $($forms[nextIndex]).removeClass("hidden");
    if(currIndex !== 2){
        currIndex++
    }
})